<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Title</title>
  <link href="./css/index.css" rel="stylesheet">
  <style>
    h1 {
      color: #000;
    }
    svg {
      min-width: 600px;
      min-height: 200px;
      overflow: auto;
    }
  </style>
</head>
<body>
<h1>SVG circle</h1>
<svg xmlns="http://www.w3.org/2000/svg" version="1.1">
  <circle cx="100" cy="50" r="40" stroke="black"
          stroke-width="2" fill="red"/>
</svg>

<svg xmlns="http://www.w3.org/2000/svg" version="1.1">
  <ellipse cx="150" cy="80" rx="100" ry="50"
           style="fill:yellow;stroke:purple;stroke-width:2"/>
</svg>

<svg xmlns="http://www.w3.org/2000/svg" version="1.1">
  <ellipse cx="240" cy="100" rx="220" ry="30" style="fill:purple"/>
  <ellipse cx="240" cy="70" rx="190" ry="20" style="fill:lime"/>
  <ellipse cx="240" cy="45" rx="170" ry="15" style="fill:yellow"/>
</svg>
<!--<script src="https://cdn.bootcss.com/jquery/3.2.1/jquery.min.js"></script>-->
<script src="./js/d3.v4.min.js"></script>
<script src="./js/svg.js"></script>
</body>
</html>